import { resolve } from "path";

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import Components from "unplugin-vue-components/vite";
import { AntDesignVueResolver } from "unplugin-vue-components/resolvers";
import { visualizer } from "rollup-plugin-visualizer";

const pathresolve = (dir) => resolve(__dirname, dir);

const serverConf = {
  proxy: {
    "/api": {
      target: "http://localhost:8000",
      changeOrigin: true,
      rewrite: (path) => path.replace(/^\/api/, ""),
    },
  },
};

// https://vitejs.dev/config/
export default defineConfig({
  server: serverConf,
  build: {
    target: "es2015",
    cssCodeSplit: true,
  },
  css: {
    postcss: {
      plugins: [
        require("autoprefixer")({
          overrideBrowserslist: [
            "Android 4.1",
            "iOS 7.1",
            "Chrome > 31",
            "ff > 31",
            "ie >= 8",
            "> 1%",
          ],
          grid: true,
        }),
        require("postcss-flexbugs-fixes"),
      ],
    },
    preprocessorOptions: {
      less: {
        javascriptEnabled: true,
        modifyVars: {
          // "@primary-color": "red",
        },
      },
    },
  },
  plugins: [
    visualizer(),
    vue(),
    Components({
      resolvers: [AntDesignVueResolver()],
    }),
  ],
  resolve: {
    alias: {
      "@": pathresolve("src"),
      "@assets": pathresolve("src/assets"),
      "@config": pathresolve("src/config"),
      "@common": pathresolve("src/common"),
      "@comps": pathresolve("src/components"),
      "@dict": pathresolve("src/dict"),
      "@layout": pathresolve("src/layout"),
      "@page": pathresolve("src/page"),
      "@pojo": pathresolve("src/pojo"),
      "@service": pathresolve("src/service"),
      "@store": pathresolve("src/store"),
      "@utils": pathresolve("src/utils"),
    },
  },
});
